<template>
	<!-- 平台电子模板预览简历 -->
	<view class="wrap">
		<view class="flex jcsb mar-top-20">		
			<view class="resume-item" v-for="(item,index) in resumeData" :key="index">
				<view  v-if="item.defaults == 1">
					<text class="moren fs-36 fc-84">默认电子版简历</text>
					<text class="horms">默认</text>
				</view>
				<text  v-else class="horms h-vip">vip</text>
				<view class="button-box" @click="goResumeEidt(item.resumeId)">
					<button  v-if="item.defaults" class="preview-but use-but">正在使用</button>
					<button v-else class="preview-but" @tap.stop="toPreview(item.id)">点击预览</button>
				</view>
			</view>
		</view>
		<view class="btn-row row">
			<button type="primary" class="btn-save width-90" @tap="addResume">添加简历</button>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				resumeData:[],	
				defaults:1,//默认
			}	
		},
		onShow: function () {
			this.getResumeList()
		},
		mounted() {
			
		},
		methods:{
			async getResumeList(){
				let res= await this.$apis.getResumeList({resumeWxuserId:uni.getStorageSync('wxuser_id')});//
				if(res){
					res.rows[0].defaults = this.defaults
					this.resumeData = res.rows
				}
			},
			//预览
			toPreview(id){
				uni.navigateTo({
					url: "./previewTemplate?id="+id
				})
			},
			//正在使用
			goResumeEidt(resumeId){
				uni.navigateTo({
					url: "./resume?resumeId="+resumeId
				})
			},
			//添加简历
			async addResume(){
				let res = await this.$apis.addResume({resumeWxuserId:uni.getStorageSync('wxuser_id')});
				if(res){
					uni.navigateTo({
						url: "./resume?resumeId="+res.data
					})
				}
			}
		}
	}
</script>

<style lang="scss">
	page{
		background: #2E2E2E;
		.resume-item{
			position: relative;
			width: 314rpx;
			height: 460rpx;
			background: #fff;
			border-radius: 4rpx;
			margin-bottom: 26rpx;
			overflow: hidden;
			border: 10rpx solid #757575;
			.moren{
				line-height: 460rpx;
				text-align: center;
				display: block;
			}
			.jlimg{
				margin: 8rpx auto;
				width: 312rpx;
				height: 444rpx;
				display: block;
			}
			.horms{
				width: 66rpx;
				height: 36rpx;
				background: #84C0F4;
				border-radius: 0rpx 0rpx 18rpx 0rpx;
				position: absolute;
				top: 0;
				font-size: 24rpx;
				color: #fff;
				text-align: center;
			}
			.h-vip{
				background: #FCDCB7;
				color: #925A1B;
			}
			.preview-but{
				display: block;
				position: absolute;
				bottom: 0;
				z-index: 1;
				width: 332rpx;
				height: 74rpx;
				line-height: 74rpx;
				background: #FCDCB7;
				color: #925A1B;
				border-radius: 0rpx 0rpx 8rpx 8rpx;
			}
			.use-but{
				background: #84C0F4;
				color: #fff;
			}
			.button-box{
				position: absolute;
				left: 0;
				right: 0;
				z-index: 1;
				top: 0;
				bottom: 0;
				.b-box-view{
					position: absolute;
					z-index: 11;
					top: 0;
					right: 0;
					bottom: 0;
					left: 0;
				}
			}
		}
		.btn-row {
		    position: fixed;
			left: 0;
			right:0;
		    bottom: 20rpx;
		    width: 100%;
		    padding-bottom: constant(safe-area-inset-bottom);
		    padding-bottom: env(safe-area-inset-bottom);
		    box-sizing: content-box;
			.btn-save {
				background-color: #84C0F4;
				height: 90rpx;
				line-height: 90rpx;
				font-size: 34rpx;
				width: 90%;			
				display: block;
				margin: 0 auto;
			}
		}
	}	
</style>
